<html>
    <head>
        <style>
            body {
                font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI',
                    Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans',
                    'Helvetica Neue', sans-serif;
            }
        </style>
        <style id="__sfc-styles">
            @import 'https://unpkg.com/todomvc-app-css@2.4.1/index.css';
        </style>
        <script>
            ;(() => {
                let scriptEls = []

                window.process = { env: {} }
                window.__modules__ = {}

                window.__export__ = (mod, key, get) => {
                    Object.defineProperty(mod, key, {
                        enumerable: true,
                        configurable: true,
                        get,
                    })
                }

                window.__dynamic_import__ = (key) => {
                    return Promise.resolve(window.__modules__[key])
                }

                async function handle_message(ev) {
                    let { action, cmd_id } = ev.data
                    const send_message = (payload) =>
                        parent.postMessage({ ...payload }, ev.origin)
                    const send_reply = (payload) =>
                        send_message({ ...payload, cmd_id })
                    const send_ok = () => send_reply({ action: 'cmd_ok' })
                    const send_error = (message, stack) =>
                        send_reply({ action: 'cmd_error', message, stack })

                    if (action === 'eval') {
                        try {
                            if (scriptEls.length) {
                                scriptEls.forEach((el) => {
                                    document.head.removeChild(el)
                                })
                                scriptEls.length = 0
                            }

                            let { script: scripts } = ev.data.args
                            if (typeof scripts === 'string') scripts = [scripts]

                            for (const script of scripts) {
                                const scriptEl =
                                    document.createElement('script')
                                scriptEl.setAttribute('type', 'module')
                                // send ok in the module script to ensure sequential evaluation
                                // of multiple proxy.eval() calls
                                const done = new Promise((resolve) => {
                                    //window.__next__ = resolve
                                })
                                scriptEl.innerHTML =
                                    script + `\n//window.__next__()`
                                document.head.appendChild(scriptEl)
                                scriptEl.onerror = (err) =>
                                    send_error(err.message, err.stack)
                                scriptEls.push(scriptEl)
                                await done
                            }
                            send_ok()
                        } catch (e) {
                            send_error(e.message, e.stack)
                        }
                    }

                    if (action === 'catch_clicks') {
                        try {
                            const top_origin = ev.origin
                            document.body.addEventListener('click', (event) => {
                                if (event.which !== 1) return
                                if (
                                    event.metaKey ||
                                    event.ctrlKey ||
                                    event.shiftKey
                                )
                                    return
                                if (event.defaultPrevented) return

                                // ensure target is a link
                                let el = event.target
                                while (el && el.nodeName !== 'A')
                                    el = el.parentNode
                                if (!el || el.nodeName !== 'A') return

                                if (
                                    el.hasAttribute('download') ||
                                    el.getAttribute('rel') === 'external' ||
                                    el.target
                                )
                                    return

                                event.preventDefault()

                                if (el.href.startsWith(top_origin)) {
                                    const url = new URL(el.href)
                                    if (url.hash[0] === '#') {
                                        window.location.hash = url.hash
                                        return
                                    }
                                }

                                window.open(el.href, '_blank')
                            })
                            send_ok()
                        } catch (e) {
                            send_error(e.message, e.stack)
                        }
                    }
                }

                window.addEventListener('message', handle_message, false)

                window.onerror = function (msg, url, lineNo, columnNo, error) {
                    if (msg.includes('module specifier “vue”')) {
                        // firefox only error, ignore
                        return false
                    }
                    try {
                        parent.postMessage(
                            { action: 'error', value: error },
                            '*'
                        )
                    } catch (e) {
                        parent.postMessage({ action: 'error', value: msg }, '*')
                    }
                }

                window.addEventListener('unhandledrejection', (event) => {
                    if (event.reason.message.includes('Cross-origin')) {
                        event.preventDefault()
                        return
                    }
                    try {
                        parent.postMessage(
                            {
                                action: 'unhandledrejection',
                                value: event.reason,
                            },
                            '*'
                        )
                    } catch (e) {
                        parent.postMessage(
                            {
                                action: 'unhandledrejection',
                                value: event.reason.message,
                            },
                            '*'
                        )
                    }
                })

                let previous = { level: null, args: null }

                ;[
                    'clear',
                    'log',
                    'info',
                    'dir',
                    'warn',
                    'error',
                    'table',
                ].forEach((level) => {
                    const original = console[level]
                    console[level] = (...args) => {
                        const msg = String(args[0])
                        if (
                            msg.includes(
                                'You are running a development build of Vue'
                            ) ||
                            msg.includes(
                                'You are running the esm-bundler build of Vue'
                            )
                        ) {
                            return
                        }
                        const stringifiedArgs = stringify(args)
                        if (
                            previous.level === level &&
                            previous.args &&
                            previous.args === stringifiedArgs
                        ) {
                            parent.postMessage(
                                { action: 'console', level, duplicate: true },
                                '*'
                            )
                        } else {
                            previous = { level, args: stringifiedArgs }

                            try {
                                parent.postMessage(
                                    { action: 'console', level, args },
                                    '*'
                                )
                            } catch (err) {
                                parent.postMessage(
                                    {
                                        action: 'console',
                                        level,
                                        args: args.map((a) => {
                                            return a instanceof Error
                                                ? a.message
                                                : String(a)
                                        }),
                                    },
                                    '*'
                                )
                            }
                        }

                        original(...args)
                    }
                })
                ;[
                    { method: 'group', action: 'console_group' },
                    { method: 'groupEnd', action: 'console_group_end' },
                    {
                        method: 'groupCollapsed',
                        action: 'console_group_collapsed',
                    },
                ].forEach((group_action) => {
                    const original = console[group_action.method]
                    console[group_action.method] = (label) => {
                        parent.postMessage(
                            { action: group_action.action, label },
                            '*'
                        )

                        original(label)
                    }
                })

                const timers = new Map()
                const original_time = console.time
                const original_timelog = console.timeLog
                const original_timeend = console.timeEnd

                console.time = (label = 'default') => {
                    original_time(label)
                    timers.set(label, performance.now())
                }
                console.timeLog = (label = 'default') => {
                    original_timelog(label)
                    const now = performance.now()
                    if (timers.has(label)) {
                        parent.postMessage(
                            {
                                action: 'console',
                                level: 'system-log',
                                args: [
                                    `${label}: ${now - timers.get(label)}ms`,
                                ],
                            },
                            '*'
                        )
                    } else {
                        parent.postMessage(
                            {
                                action: 'console',
                                level: 'system-warn',
                                args: [`Timer '${label}' does not exist`],
                            },
                            '*'
                        )
                    }
                }
                console.timeEnd = (label = 'default') => {
                    original_timeend(label)
                    const now = performance.now()
                    if (timers.has(label)) {
                        parent.postMessage(
                            {
                                action: 'console',
                                level: 'system-log',
                                args: [
                                    `${label}: ${now - timers.get(label)}ms`,
                                ],
                            },
                            '*'
                        )
                    } else {
                        parent.postMessage(
                            {
                                action: 'console',
                                level: 'system-warn',
                                args: [`Timer '${label}' does not exist`],
                            },
                            '*'
                        )
                    }
                    timers.delete(label)
                }

                const original_assert = console.assert
                console.assert = (condition, ...args) => {
                    if (condition) {
                        const stack = new Error().stack
                        parent.postMessage(
                            { action: 'console', level: 'assert', args, stack },
                            '*'
                        )
                    }
                    original_assert(condition, ...args)
                }

                const counter = new Map()
                const original_count = console.count
                const original_countreset = console.countReset

                console.count = (label = 'default') => {
                    counter.set(label, (counter.get(label) || 0) + 1)
                    parent.postMessage(
                        {
                            action: 'console',
                            level: 'system-log',
                            args: `${label}: ${counter.get(label)}`,
                        },
                        '*'
                    )
                    original_count(label)
                }

                console.countReset = (label = 'default') => {
                    if (counter.has(label)) {
                        counter.set(label, 0)
                    } else {
                        parent.postMessage(
                            {
                                action: 'console',
                                level: 'system-warn',
                                args: `Count for '${label}' does not exist`,
                            },
                            '*'
                        )
                    }
                    original_countreset(label)
                }

                const original_trace = console.trace

                console.trace = (...args) => {
                    const stack = new Error().stack
                    parent.postMessage(
                        { action: 'console', level: 'trace', args, stack },
                        '*'
                    )
                    original_trace(...args)
                }

                function stringify(args) {
                    try {
                        return JSON.stringify(args)
                    } catch (error) {
                        return null
                    }
                }
            })()
        </script>

        <!-- ES Module Shims: Import maps polyfill for modules browsers without import maps support (all except Chrome 89+) -->
        <script
            async=""
            src="https://unpkg.com/es-module-shims@1.5.18/dist/es-module-shims.wasm.js"
        ></script>
        <script type="importmap">
            {
                "imports": {
                    "vue": "https://unpkg.com/vue@3.2.38/dist/vue.esm-browser.js"
                }
            }
        </script>
        <script type="module">
            window.__modules__ = {}
            window.__css__ = ''
            if (window.__app__) window.__app__.unmount()
            document.body.innerHTML = '<div id="app"></div>'
            // //window.__next__()
        </script>
        <script type="module">
            const __module__ = (__modules__['App.vue'] = {
                [Symbol.toStringTag]: 'Module',
            })

            /* Analyzed bindings: {
"filteredTodos": "options",
"remaining": "options",
"toggleAll": "options",
"addTodo": "options",
"removeTodo": "options",
"editTodo": "options",
"doneEdit": "options",
"cancelEdit": "options",
"removeCompleted": "options",
"onHashChange": "options"
} */

            const STORAGE_KEY = 'vue-todomvc'

            const filters = {
                all: (todos) => todos,
                active: (todos) => todos.filter((todo) => !todo.completed),
                completed: (todos) => todos.filter((todo) => todo.completed),
            }

            const __sfc__ = {
                // 初始化应用状态
                data: () => ({
                    todos: JSON.parse(
                        localStorage.getItem(STORAGE_KEY) || '[]'
                    ),
                    editedTodo: null,
                    visibility: 'all',
                }),

                // 侦听 todos 的变化，以通过 localStorage 持久化
                watch: {
                    todos: {
                        handler(todos) {
                            localStorage.setItem(
                                STORAGE_KEY,
                                JSON.stringify(todos)
                            )
                        },
                        deep: true,
                    },
                },

                mounted() {
                    window.addEventListener('hashchange', this.onHashChange)
                    this.onHashChange()
                },

                computed: {
                    filteredTodos() {
                        return filters[this.visibility](this.todos)
                    },
                    remaining() {
                        return filters.active(this.todos).length
                    },
                },

                // 数据逻辑的方法实现。
                // 注意这里没有 DOM 操作。
                methods: {
                    toggleAll(e) {
                        this.todos.forEach(
                            (todo) => (todo.completed = e.target.checked)
                        )
                    },

                    addTodo(e) {
                        const value = e.target.value.trim()
                        if (!value) {
                            return
                        }
                        this.todos.push({
                            id: Date.now(),
                            title: value,
                            completed: false,
                        })
                        e.target.value = ''
                    },

                    removeTodo(todo) {
                        this.todos.splice(this.todos.indexOf(todo), 1)
                    },

                    editTodo(todo) {
                        this.beforeEditCache = todo.title
                        this.editedTodo = todo
                    },

                    doneEdit(todo) {
                        if (!this.editedTodo) {
                            return
                        }
                        this.editedTodo = null
                        todo.title = todo.title.trim()
                        if (!todo.title) {
                            this.removeTodo(todo)
                        }
                    },

                    cancelEdit(todo) {
                        this.editedTodo = null
                        todo.title = this.beforeEditCache
                    },

                    removeCompleted() {
                        this.todos = filters.active(this.todos)
                    },

                    onHashChange() {
                        var visibility = window.location.hash.replace(
                            /#\/?/,
                            ''
                        )
                        if (filters[visibility]) {
                            this.visibility = visibility
                        } else {
                            window.location.hash = ''
                            this.visibility = 'all'
                        }
                    },
                },
            }

            import {
                createElementVNode as _createElementVNode,
                withKeys as _withKeys,
                renderList as _renderList,
                Fragment as _Fragment,
                openBlock as _openBlock,
                createElementBlock as _createElementBlock,
                vModelCheckbox as _vModelCheckbox,
                withDirectives as _withDirectives,
                toDisplayString as _toDisplayString,
                vModelText as _vModelText,
                createCommentVNode as _createCommentVNode,
                normalizeClass as _normalizeClass,
                vShow as _vShow,
            } from 'vue'

            const _hoisted_1 = { class: 'todoapp' }
            const _hoisted_2 = { class: 'header' }
            const _hoisted_3 = /*#__PURE__*/ _createElementVNode(
                'h1',
                null,
                'todos',
                -1 /* HOISTED */
            )
            const _hoisted_4 = { class: 'main' }
            const _hoisted_5 = ['checked']
            const _hoisted_6 = /*#__PURE__*/ _createElementVNode(
                'label',
                { for: 'toggle-all' },
                'Mark all as complete',
                -1 /* HOISTED */
            )
            const _hoisted_7 = { class: 'todo-list' }
            const _hoisted_8 = { class: 'view' }
            const _hoisted_9 = ['onUpdate:modelValue']
            const _hoisted_10 = ['onDblclick']
            const _hoisted_11 = ['onClick']
            const _hoisted_12 = ['onUpdate:modelValue', 'onBlur', 'onKeyup']
            const _hoisted_13 = { class: 'footer' }
            const _hoisted_14 = { class: 'todo-count' }
            const _hoisted_15 = { class: 'filters' }
            function render(_ctx, _cache, $props, $setup, $data, $options) {
                return (
                    _openBlock(),
                    _createElementBlock('section', _hoisted_1, [
                        _createElementVNode('header', _hoisted_2, [
                            _hoisted_3,
                            _createElementVNode(
                                'input',
                                {
                                    class: 'new-todo',
                                    autofocus: '',
                                    placeholder: 'What needs to be done?',
                                    onKeyup:
                                        _cache[0] ||
                                        (_cache[0] = _withKeys(
                                            (...args) =>
                                                $options.addTodo &&
                                                $options.addTodo(...args),
                                            ['enter']
                                        )),
                                },
                                null,
                                32 /* HYDRATE_EVENTS */
                            ),
                        ]),
                        _withDirectives(
                            _createElementVNode(
                                'section',
                                _hoisted_4,
                                [
                                    _createElementVNode(
                                        'input',
                                        {
                                            id: 'toggle-all',
                                            class: 'toggle-all',
                                            type: 'checkbox',
                                            checked: $options.remaining === 0,
                                            onChange:
                                                _cache[1] ||
                                                (_cache[1] = (...args) =>
                                                    $options.toggleAll &&
                                                    $options.toggleAll(
                                                        ...args
                                                    )),
                                        },
                                        null,
                                        40 /* PROPS, HYDRATE_EVENTS */,
                                        _hoisted_5
                                    ),
                                    _hoisted_6,
                                    _createElementVNode('ul', _hoisted_7, [
                                        (_openBlock(true),
                                        _createElementBlock(
                                            _Fragment,
                                            null,
                                            _renderList(
                                                $options.filteredTodos,
                                                (todo) => {
                                                    return (
                                                        _openBlock(),
                                                        _createElementBlock(
                                                            'li',
                                                            {
                                                                class: _normalizeClass(
                                                                    [
                                                                        'todo',
                                                                        {
                                                                            completed:
                                                                                todo.completed,
                                                                            editing:
                                                                                todo ===
                                                                                _ctx.editedTodo,
                                                                        },
                                                                    ]
                                                                ),
                                                                key: todo.id,
                                                            },
                                                            [
                                                                _createElementVNode(
                                                                    'div',
                                                                    _hoisted_8,
                                                                    [
                                                                        _withDirectives(
                                                                            _createElementVNode(
                                                                                'input',
                                                                                {
                                                                                    class: 'toggle',
                                                                                    type: 'checkbox',
                                                                                    'onUpdate:modelValue':
                                                                                        (
                                                                                            $event
                                                                                        ) =>
                                                                                            (todo.completed =
                                                                                                $event),
                                                                                },
                                                                                null,
                                                                                8 /* PROPS */,
                                                                                _hoisted_9
                                                                            ),
                                                                            [
                                                                                [
                                                                                    _vModelCheckbox,
                                                                                    todo.completed,
                                                                                ],
                                                                            ]
                                                                        ),
                                                                        _createElementVNode(
                                                                            'label',
                                                                            {
                                                                                onDblclick:
                                                                                    (
                                                                                        $event
                                                                                    ) =>
                                                                                        $options.editTodo(
                                                                                            todo
                                                                                        ),
                                                                            },
                                                                            _toDisplayString(
                                                                                todo.title
                                                                            ),
                                                                            41 /* TEXT, PROPS, HYDRATE_EVENTS */,
                                                                            _hoisted_10
                                                                        ),
                                                                        _createElementVNode(
                                                                            'button',
                                                                            {
                                                                                class: 'destroy',
                                                                                onClick:
                                                                                    (
                                                                                        $event
                                                                                    ) =>
                                                                                        $options.removeTodo(
                                                                                            todo
                                                                                        ),
                                                                            },
                                                                            null,
                                                                            8 /* PROPS */,
                                                                            _hoisted_11
                                                                        ),
                                                                    ]
                                                                ),
                                                                todo ===
                                                                _ctx.editedTodo
                                                                    ? _withDirectives(
                                                                          (_openBlock(),
                                                                          _createElementBlock(
                                                                              'input',
                                                                              {
                                                                                  key: 0,
                                                                                  class: 'edit',
                                                                                  type: 'text',
                                                                                  'onUpdate:modelValue':
                                                                                      (
                                                                                          $event
                                                                                      ) =>
                                                                                          (todo.title =
                                                                                              $event),
                                                                                  onVnodeMounted:
                                                                                      _cache[2] ||
                                                                                      (_cache[2] =
                                                                                          ({
                                                                                              el,
                                                                                          }) =>
                                                                                              el.focus()),
                                                                                  onBlur: (
                                                                                      $event
                                                                                  ) =>
                                                                                      $options.doneEdit(
                                                                                          todo
                                                                                      ),
                                                                                  onKeyup:
                                                                                      [
                                                                                          _withKeys(
                                                                                              (
                                                                                                  $event
                                                                                              ) =>
                                                                                                  $options.doneEdit(
                                                                                                      todo
                                                                                                  ),
                                                                                              [
                                                                                                  'enter',
                                                                                              ]
                                                                                          ),
                                                                                          _withKeys(
                                                                                              (
                                                                                                  $event
                                                                                              ) =>
                                                                                                  $options.cancelEdit(
                                                                                                      todo
                                                                                                  ),
                                                                                              [
                                                                                                  'escape',
                                                                                              ]
                                                                                          ),
                                                                                      ],
                                                                              },
                                                                              null,
                                                                              40 /* PROPS, HYDRATE_EVENTS */,
                                                                              _hoisted_12
                                                                          )),
                                                                          [
                                                                              [
                                                                                  _vModelText,
                                                                                  todo.title,
                                                                              ],
                                                                          ]
                                                                      )
                                                                    : _createCommentVNode(
                                                                          'v-if',
                                                                          true
                                                                      ),
                                                            ],
                                                            2 /* CLASS */
                                                        )
                                                    )
                                                }
                                            ),
                                            128 /* KEYED_FRAGMENT */
                                        )),
                                    ]),
                                ],
                                512 /* NEED_PATCH */
                            ),
                            [[_vShow, _ctx.todos.length]]
                        ),
                        _withDirectives(
                            _createElementVNode(
                                'footer',
                                _hoisted_13,
                                [
                                    _createElementVNode('span', _hoisted_14, [
                                        _createElementVNode(
                                            'strong',
                                            null,
                                            _toDisplayString(
                                                $options.remaining
                                            ),
                                            1 /* TEXT */
                                        ),
                                        _createElementVNode(
                                            'span',
                                            null,
                                            _toDisplayString(
                                                $options.remaining === 1
                                                    ? 'item'
                                                    : 'items'
                                            ) + ' left',
                                            1 /* TEXT */
                                        ),
                                    ]),
                                    _createElementVNode('ul', _hoisted_15, [
                                        _createElementVNode('li', null, [
                                            _createElementVNode(
                                                'a',
                                                {
                                                    href: '#/all',
                                                    class: _normalizeClass({
                                                        selected:
                                                            _ctx.visibility ===
                                                            'all',
                                                    }),
                                                },
                                                'All',
                                                2 /* CLASS */
                                            ),
                                        ]),
                                        _createElementVNode('li', null, [
                                            _createElementVNode(
                                                'a',
                                                {
                                                    href: '#/active',
                                                    class: _normalizeClass({
                                                        selected:
                                                            _ctx.visibility ===
                                                            'active',
                                                    }),
                                                },
                                                'Active',
                                                2 /* CLASS */
                                            ),
                                        ]),
                                        _createElementVNode('li', null, [
                                            _createElementVNode(
                                                'a',
                                                {
                                                    href: '#/completed',
                                                    class: _normalizeClass({
                                                        selected:
                                                            _ctx.visibility ===
                                                            'completed',
                                                    }),
                                                },
                                                'Completed',
                                                2 /* CLASS */
                                            ),
                                        ]),
                                    ]),
                                    _withDirectives(
                                        _createElementVNode(
                                            'button',
                                            {
                                                class: 'clear-completed',
                                                onClick:
                                                    _cache[3] ||
                                                    (_cache[3] = (...args) =>
                                                        $options.removeCompleted &&
                                                        $options.removeCompleted(
                                                            ...args
                                                        )),
                                            },
                                            ' Clear completed ',
                                            512 /* NEED_PATCH */
                                        ),
                                        [
                                            [
                                                _vShow,
                                                _ctx.todos.length >
                                                    $options.remaining,
                                            ],
                                        ]
                                    ),
                                ],
                                512 /* NEED_PATCH */
                            ),
                            [[_vShow, _ctx.todos.length]]
                        ),
                    ])
                )
            }
            __sfc__.render = render
            __sfc__.__file = 'App.vue'
            __module__.default = __sfc__
            window.__css__ +=
                '@import "https://unpkg.com/todomvc-app-css@2.4.1/index.css";'
            //window.__next__()
        </script>
        <script type="module">
            document.getElementById('__sfc-styles').innerHTML = window.__css__
            //window.__next__()
        </script>
        <script type="module">
            import { createApp as _createApp } from 'vue'
            const _mount = () => {
                const AppComponent = __modules__['App.vue'].default
                AppComponent.name = 'Repl'
                const app = (window.__app__ = _createApp(AppComponent))
                app.config.unwrapInjectedRef = true
                app.config.errorHandler = (e) => console.error(e)
                app.mount('#app')
            }
            if (window.__ssr_promise__) {
                window.__ssr_promise__.then(_mount)
            } else {
                _mount()
            }
            //window.__next__()
        </script>
    </head>
    <body>
        <div id="app" data-v-app="">
            <section class="todoapp">
                <header class="header">
                    <h1>todos</h1>
                    <input
                        class="new-todo"
                        autofocus=""
                        placeholder="What needs to be done?"
                    />
                </header>
                <section class="main">
                    <input
                        id="toggle-all"
                        class="toggle-all"
                        type="checkbox"
                    /><label for="toggle-all">Mark all as complete</label>
                    <ul class="todo-list">
                        <li class="todo completed">
                            <div class="view">
                                <input class="toggle" type="checkbox" /><label
                                    >JKFDSH</label
                                ><button class="destroy"></button>
                            </div>
                            <!--v-if-->
                        </li>
                        <li class="todo">
                            <div class="view">
                                <input class="toggle" type="checkbox" /><label
                                    >啊可接受的</label
                                ><button class="destroy"></button>
                            </div>
                            <!--v-if-->
                        </li>
                        <li class="todo completed">
                            <div class="view">
                                <input class="toggle" type="checkbox" /><label
                                    >卡仕达</label
                                ><button class="destroy"></button>
                            </div>
                            <!--v-if-->
                        </li>
                        <li class="todo">
                            <div class="view">
                                <input class="toggle" type="checkbox" /><label
                                    >按实际客户端</label
                                ><button class="destroy"></button>
                            </div>
                            <!--v-if-->
                        </li>
                    </ul>
                </section>
                <footer class="footer">
                    <span class="todo-count"
                        ><strong>2</strong><span>items left</span></span
                    >
                    <ul class="filters">
                        <li><a href="#/all" class="selected">All</a></li>
                        <li><a href="#/active" class="">Active</a></li>
                        <li><a href="#/completed" class="">Completed</a></li>
                    </ul>
                    <button class="clear-completed">Clear completed</button>
                </footer>
            </section>
        </div>
    </body>
</html>
